<template>
  <div>
    <ListItem v-for="v in cartList" :key="v.id" :v="v">
      <template #prefix>
        <van-checkbox v-model="v.state"></van-checkbox>
      </template>
      <template #desc>
        <div>
          <van-stepper v-model="v.count"></van-stepper>
        </div>
      </template>
    </ListItem>

    <van-submit-bar :price="allPrice * 100" button-text="提交订单" @submit="onSubmit">
      <van-checkbox :checked="allState" @click="changeAllState">全选</van-checkbox>
    </van-submit-bar>
  </div>
</template>

<script setup>
import { useCartHooks } from '@/stores/cart'
import ListItem from '@/components/list-item/index.vue'
import { computed } from 'vue'
const { cartList, changeAllState } = useCartHooks()
const allState = computed(() => useCartHooks().allState)
const allPrice = computed(() => useCartHooks().allPrice)
const onSubmit = () => '点击按钮'
</script>

<style lang="scss">
.van-submit-bar {
  bottom: 50px;
}
</style>
